<template>
  <div class="content">
      <page-header sub-title="百度网盘会员"></page-header>
      <div v-if="isShow">
        <div class="banner" v-if="activity != null">
          <img width="100%" src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-a53b2bc0-86af-4019-917d-0994ec60066d/a8e004e5-4eb4-4b13-8812-e8c3c011f4f7.png" >
          <div style="text-align: center;margin: 30px auto;">
            <a-button type="danger" style="width:2.2rem;"
              @click="global.copy(`bdnetdisk://n/action.HUO_DONG?m_n_v=11.9.2&type=invitation&url=https://pan.baidu.com/component/view/${activity.activityId}?from=dd`,'复制成功，请打开百度网盘APP')">
                复制口令
              </a-button>
            <p style="margin-top: 10px;">
              更新时间：{{global.parseTimestamp(activity.updateTime)}}
            </p>
          </div>

          <div class="" style="width:2.64rem;margin: auto;">
          	<h2 class="title">
          		如何领取百度网盘会员？
          	</h2>
          	<p>
          		一、点击上方【复制口令】，打开【百度网盘APP】，APP将自动跳转到活动页面。
          	</p>
          	<img style="width:100%;margin: 10px auto;" src="@/static/common/pan2.png"></img>
          	<p>
          		二、点击【领取网盘会员】，完成领取。新用户可领取7天哦！
          	</p>
          	<img style="width: 100%;margin: 10px auto;" src="@/static/common/pan1.jpg"></img>
          </div>
        </div>
        <div v-else>
          <a-empty
              image="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-a53b2bc0-86af-4019-917d-0994ec60066d/f05fd1e6-9cfd-4fd2-9529-3adb5c7320c8.png"
              :image-style="{
                height: '2rem',
              }"
            >
              <span slot="description"> 客官来晚咯！活动不知飞哪去了~ <a @click="global.toPage('/activity/bdwp')">更多活动</a> </span>
            </a-empty>
        </div>
      </div>
  </div>
</template>

<script>
  import couponCard from '@/components/common/coupon-card/coupon-card.vue'
  import bannerCard from '@/components/common/banner-card/banner-card.vue'

  export default {
    components:{
      couponCard,
      bannerCard
    },
    data() {
      return {
        activity: null,
        isShow: false,
        bannerList: [
          'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-a53b2bc0-86af-4019-917d-0994ec60066d/540d732b-a2d2-4c5b-9152-38aa36e70e49.png',
          'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-a53b2bc0-86af-4019-917d-0994ec60066d/c8093413-15b5-4297-9aff-c384fb345f72.png',
        ]
      }
    },
    head() {
      return {
        title: '百度网盘 | 会员狂欢季',
        meta: [
          {
            name: 'keywords',
            content: '百度网盘会员,百度网盘超级会员,百度网盘VIP,百度网盘SVIP,1-7天百度网盘会员,免费领取百度网盘会员'
          },
          {
            name: 'description',
            content: '如何免费领取1-7天百度网盘会员？如何领取365天百度网盘会员？如何领取百度网盘超级会员？'
          }
        ]
      }
    },
    created() {
      this.$nextTick(() => {
          this.$nuxt.$loading.start()
          this.getPanDataById(this.$route.query.activityId)
      })

    },
    methods: {
      getPanDataById(activityId) {
        let self = this
        self.$axios({
          method:'get',
          url:'https://fb16def1-4f23-4050-b0e4-7e299cf70849.bspapp.com/panData?activityId='+activityId
        }).then((res)=>{
          if(res.data.data[0]) {
			self.activity = res.data.data[0]
          }
          self.$nuxt.$loading.finish();
          self.isShow = true;
        });
      }
    }
  }
</script>

<style>
  .content {
    width: 100%;
  }
  .content .banner {
    padding-top: 10px;
  }
  .ant-carousel >>> .slick-slide {
    text-align: center;
    height: 160px;
    line-height: 160px;
    background: #364d79;
    overflow: hidden;
  }

  .ant-carousel >>> .custom-slick-arrow {
    width: 25px;
    height: 25px;
    font-size: 25px;
    color: #fff;
    background-color: rgba(31, 45, 61, 1);
    opacity: 0.3;
  }
  .ant-carousel >>> .custom-slick-arrow:before {
    display: none;
  }
  .ant-carousel >>> .custom-slick-arrow:hover {
    opacity: 0.5;
  }

  .ant-carousel >>> .slick-slide h3 {
    color: #fff;
  }
</style>
